import Vue from 'vue'
import Vuex from 'vuex'
import { loginAPI, userinfoAPI } from '@/api/user'
//导入Toast
import { Toast } from 'vant'
//导入utlis里面封装的localstorage
import { getToken, setToken, removeToken } from '@/utils/auth'
import router from '@/router'

Vue.use(Vuex)

export default new Vuex.Store({
  state: {
    //保存以下token对象,本地有就拿本地的，本地没有就取空对象
    tokenObj: getToken() || {},
    //保存用户信息
    userInfo: {}
  },
  getters: {
  },
  mutations: {
    //state只能通过mutations来改，提供修改state的方法
    changeToken (state, obj) {
      //把传递过来的token对象存到state
      state.tokenObj = obj
      //拿到了token顺便存到本地
      setToken(obj)

    },
    changeUserInfo (state, obj) {
      // 把传递过来的用户信息存起来
      state.userInfo = obj
    },
    //退出需要清空state，能操作state的只有mutatiaons，所以封装一个清空state和本地存储的方法
    logout (state) {
      state.tokenObj = {}
      state.userInfo = {}
      //然后清空本地存储
      removeToken()
      //toast提示
      Toast('退出成功')
      //路由跳转
      router.push('/login')

    }
  },
  actions: {
    //异步请求只能在acitons发送，提供发送请求的方法
    async login (ctx, info) {
      //发送请求需要导入接口，toast提示
      try {
        const res = await loginAPI(info)
        // console.log(res.data)
        ctx.commit('changeToken', res.data)
        //拿到了token顺便存到本地
        // setToken(res.data)
        Toast.success('登录成功！')
        //告诉外界登录成功
        return true
        // router.push('/layout/home')
      } catch {
        //请求失败的时候
        Toast.fail('验证码出错')
        //告诉外界登录失败
        return false
      }
    },
    // 发送得到userinfo的异步请求
    async getUserInfo (ctx) {
      //以下是请求优化，如果vuex里面的state.userInfo有数值，就不要继续发送请求了
      if (!ctx.state.userInfo.name) {

        const res = await userinfoAPI()
        // console.log(res.data)
        ctx.commit('changeUserInfo', res.data)
      }
    }
  },
  modules: {
  }
})
